import React from 'react';
import {useNavigate} from 'react-router-dom'
import * as service from '../../../../../api/zynindex'
import { Button, Layout, Form, theme, Input, Select, TreeSelect, DatePicker,Space, message } from 'antd';
// import { PlusOutlined } from '@ant-design/icons';
import '../AddThing/AddThing.scss'
// import FormItem from 'antd/es/form/FormItem';
const { Option } = Select;
const { Content } = Layout;

interface Props {

}

function AddThing(props: Props) {
    const [messageApi, contextHolder] = message.useMessage()
    const info = () => {
        messageApi.info('新增成功');
        // navigate(-1)
      };
    var navigate = useNavigate()
    const {
        token: { colorBgContainer },
    } = theme.useToken();

    // 新增资产
    const onFinish = async (values: any) => {
        // console.log(values);
        var res = await service.asset_add(values)
        console.log(res);

    };

    // 取消跳转到列表页
    var  toList=()=>{
        navigate(-1)
    }
    return (
        <div className='addthing'>
            <Content style={{
                padding: 24,
                margin: 0,
                minHeight: 280,
                background: colorBgContainer,
            }} >
                <div className="shang">
                    <div className="line"> </div>
                    <div className="set">新增资产</div>
                </div>
                <Form
                    labelCol={{ span: 8 }}
                    wrapperCol={{ span: 16 }}

                    initialValues={{ remember: true }}
                    onFinish={onFinish}
                    //   onFinishFailed={onFinishFailed}
                    autoComplete="off"
                >
                    <Form.Item
                        label="资产名称"
                        name="name"
                        rules={[{ required: true, message: '请输入资产名称' }]}
                    >
                        <Input />
                    </Form.Item>
                    <Form.Item label="资产编号" name='num'>
                        <Input placeholder="请输入" />
                    </Form.Item>
                    <Form.Item label="资产状态" name="status">
                        <Input placeholder="请输入" />
                    </Form.Item>
                    <Form.Item label="资产来源" name='b'>
                        <Select >
                            <Option value="请选择">请选择</Option>
                            <Option value="购入">购入</Option>
                            <Option value="自建">自建</Option>
                            <Option value="盘盈">盘盈</Option>
                            <Option value="其他">其他</Option>
                        </Select>
                    </Form.Item>
                    <Form.Item label="所属部门" name="bemen">
                        <TreeSelect
                            treeData={[
                                {
                                    title: '黛西进出口贸易公司', value: '黛西进出口贸易公司',
                                    children: [
                                        {
                                            title: '杭州分公司', value: '杭州分公司',
                                            children: [
                                                { title: '行销部', value: '行销部' },
                                                { title: '设计部', value: '设计部' }
                                            ]
                                        },
                                        { title: '产品部', value: '产品部' }
                                    ]
                                },

                            ]}
                        />
                    </Form.Item>
                    <Form.Item label="使用部门" name='c'>
                        <TreeSelect
                            treeData={[
                                {
                                    title: '黛西进出口贸易公司', value: '黛西进出口贸易公司',
                                    children: [
                                        {
                                            title: '杭州分公司', value: '杭州分公司',
                                            children: [
                                                { title: '行销部', value: '行销部' },
                                                { title: '设计部', value: '设计部' }
                                            ]
                                        },
                                        { title: '产品部', value: '产品部' }
                                    ]
                                },
                            ]}
                        />
                    </Form.Item>

                    <Form.Item label="资产类别" name='kind'>
                        <TreeSelect
                            treeData={[
                                {
                                    title: '电子产品及通讯设备', value: '电子产品及通讯设备',
                                    children: [
                                        { title: '电脑', value: '电脑' },
                                        { title: '投影仪', value: '投影仪' },
                                        { title: '录音设备', value: '录音设备' },
                                    ]
                                },
                                {
                                    title: '办公用品', value: '办公用品',
                                    children: [
                                        { title: '笔记本', value: '笔记本' },
                                        { title: '笔', value: '笔' },
                                        { title: '纸张', value: '纸张' },
                                    ]
                                },

                            ]}
                        />
                    </Form.Item>
                    <Form.Item label="规格型号" name='d'>
                        <Input placeholder="请输入" />
                    </Form.Item>
                    <Form.Item label="序列号" name='e'>
                        <Input placeholder="请输入" />
                    </Form.Item>
                    <Form.Item label="购入日期" name='date'>
                        <DatePicker placeholder="请输入日期" />
                    </Form.Item>
                    <Form.Item
                        label="购入价格"
                        name="price"
                    >
                        <Input placeholder='请输入' />
                        {/* <span>元</span> */}
                    </Form.Item>
                    <Form.Item label="存放仓库" name="cangku">
                        <Select>
                            <Option value="请选择">请选择</Option>
                            <Option value="本地仓库">本地仓库</Option>
                            <Option value="东仓">东仓</Option>
                            <Option value="西仓">西仓</Option>
                            <Option value="南仓">南仓</Option>
                            <Option value="北仓">北仓</Option>
                        </Select>
                    </Form.Item>
                    <Form.Item>
                            <div className="btn">
                        <Space>
                                {contextHolder}
                                <Button type="primary" htmlType='submit' onClick={info}>保存</Button>
                                <Button type="primary" onClick={()=>{toList()}}>取消</Button>
                        </Space>
                            </div>
                    </Form.Item>
                </Form>
            </Content>
        </div>
    );
}


export default AddThing;